<template>
	<div style="min-height: 180px;" class="w-full py-4 pl-4 mb-4 flex flex-nowrap bg-[#F9FAFB] min-h-24"
		@mouseenter="enter" @mouseleave="leave">

		<!-- 主体信息 -->
		<div class="w-6/12 text-left relative">
			<div class="inline-block">
				<el-image :src="item.pic || machine" style="height:100%;width: 120px;"></el-image>
			</div>
			<div class="inline-block  top-1 ml-2">
				<div class="mb-2">
					{{ $t('public.name') }}：{{ item.machine_name || $t('machine.name') }}
					<el-tag v-if="item.machine_level" class="ml-2" type="danger">{{ setMachineLevel(item.machine_level)
					}}</el-tag>
				</div>
				<div class="mb-2">{{ $t('public.code') }}：{{ item.machine_id }}</div>
				<div class="mb-2">{{ $t('machine.software.softwareVer') }}：{{ item.version || '--' }}</div>
				<div class="mb-2">{{ $t('machine.appType') }}：{{ item.device_type === 1 ? $t('machine.vending') :
					$t('machine.store') }}</div>
				<div class="mb-2">
					<el-tag v-if="item.online == 1" type="success">{{ $t('public.onLine') }}</el-tag>
					<el-tag v-else type="info">{{ $t('public.offline') }}</el-tag>
					<span class="ml-2 cursor-pointer" @click="macstatus(item.m_id, item.status)">
						<el-tag v-if="item.status == 1">{{ $t('public.normal') }}</el-tag>
						<el-tag v-if="item.status == 2" type="danger">{{ $t('public.disable') }}</el-tag>
						<el-tag v-if="item.status == 3" type="warning">{{ $t('public.uphold') }}</el-tag>
					</span>
				</div>
				<div class="mb-2">
					{{ $t('date.lastOnlineTime') }}：{{ getPlevel.gettime(item.last_online_time, 3) }}
				</div>
			</div>
			<div class="mt-2">{{ $t('public.location') }}：{{ getaddress(item) }}</div>

		</div>

		<!-- 操作按钮 -->
		<div class="w-6/12 text-right relative pr-4" v-if="data.btnsstatus == true">
			<div class="inline-block" v-if="props.flag">
				<div class="mb-2" v-prmis="'error_code_getList'">
					<el-link type="primary" :underline="false" @click="toDtails(item, 'operations')">{{
						$t('machine.operation') }}</el-link>
				</div>
				<div class="mb-2" v-prmis="'machine_getOpenPass'">
					<el-link type="primary" :underline="false" @click="getPassword(item.machine_id)">{{
						$t('machine.getLockPassword') }}</el-link>
				</div>
			</div>
			<div class="inline-block" v-else>
				<div class="mb-2" v-prmis="'machine_info_getFind'">
					<el-link type="primary" :underline="false" @click="macbtninfo(item.m_id, 'overview')">{{
						$t('machine.overview') }}</el-link>
				</div>
				<div class="mb-2" v-prmis="'machine_channel_getList'">
					<el-link type="primary" :underline="false" @click="macbtninfo(item.m_id, 'channel')">{{
						$t('machine.channelMsg') }}</el-link>
				</div>
				<div class="mb-2" v-prmis="'machine_good_getList'">
					<el-link type="primary" :underline="false" @click="macbtninfo(item.m_id, 'goods')">{{
						$t('machine.shopMsg') }}</el-link>
				</div>
				<div class="mb-2" v-prmis="'machine_goods_getGcSort'">
					<el-link type="primary" :underline="false" @click="macbtninfo(item.m_id, 'category')">{{
						$t('machine.categorySort') }}</el-link>
				</div>
				<div class="mb-2" v-prmis="'country_getCountriesList'">
					<el-link type="primary" :underline="false" @click="macbtninfo(item.m_id, 'info')">{{
						$t('machine.machineMsg') }}</el-link>
				</div>
				<div class="mb-2" v-prmis="'machine_del'">
					<el-link type="danger" :underline="false" @click="macbtn(item)">{{ $t('machine.delMachine')
					}}</el-link>
				</div>
			</div>

		</div>
	</div>
</template>

<script lang="ts" setup>
import { useI18n } from 'vue-i18n'
const { t: $t } = useI18n()
import machine from '@/assets/machine.png';
import getPlevel from '@/utils/level'
import { useRouter } from "vue-router";
import { getOpenPass } from '@/api/machine';
import { ElMessageBox } from 'element-plus'

const router = useRouter()
let emit = defineEmits(['onstatus', 'onmacbtn'])

let props = defineProps({
	item: {
		type: Object,
		default: {}
	},
	flag: {
		type: String,
		default: ''
	}
})

let data = reactive({
	btnsstatus: false
})
let setMachineLevel = (e) => {
	let levelName = null
	if (e == 1) {
		levelName = $t('machine.StarterEdition')
	}
	if (e == 2) {
		levelName = $t('machine.DeluxeEdition')
	}
	return levelName
}
// 获取位置
let getaddress = (e) => {
	let address = '--'
	let countrys = e.country == undefined ? '' : e.country.cname || ''
	let state = e.city == undefined ? '' : e.city.cname || ''
	let citys = e.regions == undefined ? '' : e.regions.cname || ''
	let regions = e.state == undefined ? '' : e.state.cname || ''

	if (e.country != undefined) {
		if (e.country.name != null) {
			countrys += '(' + e.country.name + ')'
		}
	}

	if (e.city != undefined) {
		if (e.city.name != null) {
			state += '(' + e.city.name + ')'
		}
	}

	if (e.regions != undefined) {
		if (e.regions.name != null) {
			citys += '(' + e.regions.name + ')'
		}
	}

	if (e.state != undefined) {
		if (e.state.name != null) {
			regions += '(' + e.state.name + ')'
		}
	}

	address = countrys + '' + regions + '' + state + '' + citys
	props.item.address = address
	return address
}

// 修改设备状态
let macstatus = (e, k) => {
	let machine = {
		m_id: e,
		status: k
	}
	emit('onstatus', machine)
}
// 获取开锁密码
let getPassword = (e) => {
	getOpenPass(e).then(res => {
		if (res.state == 200) {
			ElMessageBox.alert(res.data.account, $t('machine.getLockPassword'), {
			})
			return
		}
		ElMessage({
			message: $t('message.networkFailed'),
			type: 'error'
		})
	}).catch(err => {
		ElMessage({
			message: err.msg,
			type: 'error'
		})
	})
}

let toDtails = (k, e) => {
	let query = {
		l: encodeURI(JSON.stringify({
			id: k,
			type: e
		}))
	}
	router.push({ path: '/machine/operations/details', query: query })
}
// 操作按钮
let macbtninfo = (k, e) => {
	let query = {
		l: encodeURI(JSON.stringify({
			id: k,
			type: e
		}))
	}
	router.push({ path: '/machine/info/details_info', query: query })
}

// 删除按钮
let macbtn = (e) => {
	emit('onmacbtn', e)
}

let enter = () => {
	data.btnsstatus = true
}

let leave = () => {
	data.btnsstatus = false
}


</script>
